<template>
  <div class="demo-formitem">
    <GetFormItem ref="form" :formData="getFormData">
      <template #custom>
        <Input placeholder="custom 1" v-model="custom1" />
        <Input placeholder="custom 2" />
      </template>
      <template #custom1>
        <p>自定义插槽展示1</p>
      </template>
    </GetFormItem>
    <Button @click="check">校验</Button>
    <Button @click="reset">重置</Button>
  </div>
</template>

<script>
import GetFormItem from "@/components/GetFormItem/index";
import formData from "./formData";
import { Input, Button } from "ant-design-vue";

export default {
  name: "demo-formitem",
  components: { GetFormItem, Input, Button },
  data() {
    return {
      formDataList: [],
      custom1: "111111",
    };
  },
  computed: {
    getFormData() {
      return formData({ custom1: this.custom1 });
    },
  },
  methods: {
    check() {
      this.$refs.form.validate().then((valid) => {
        console.log(valid);
      });
    },
    reset() {
      this.$refs.form.reset();
    },
  },
};
</script>

<style scoped lang="less">
.demo-formitem {
  width: 1000px;
}
</style>
